<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Schools</title>
</head>
<style type="text/css" media="screen">
ul li{
    list-style: none;
    margin-bottom: 10px;
}
h2 { text-align: center; }
div#content {text-align:center;}
table {margin: 0 auto}
table caption {font-size: 120%;margin-bottom: 10px}
td img {width: 200px;height: 200px}
</style>
<body>
<h2>简陋而不简单的页面</h2>
<br>
<div id="content">
    {% if items %}
    <table border="1">
        <caption>Schools</caption>
        <tbody>
        {% for item in items %}
            <tr>
              <td><img src="{{ item.odd.s_pic }}"></td>
              <td width="150px"></td>
              <td><img src="{{ item.even.s_pic }}"></td>
            </tr>
            <tr>
              <td>{{ item.odd.s_name }}</td>
              <td width="150px"></td>
              <td>{{ item.even.s_name }}</td>
            </tr>
            <tr style="margin-bottom: 20px">
              <td>{{ item.odd.s_intro }}</td>
              <td width="150px"></td>
              <td>{{ item.even.s_intro }}</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
{% else %}
    <h3>No more schools</h3>
    {% endif %}
</div>
</body>
</html>